第 1 章 jQ起步
第 2 章 jQ解密技术
第 3 章 高效选择的技巧与原理
第 4 章 文档对象的操作及高效实践
第 5 章 事件封装机制与解析
5.1 事件模型
1 0级事件模型
2 事件模型中的Event对象
3 事件模型中的冒泡现象
4 事件流控制与默认事件动作
5 2级DOM标准事件模型
addEventListener(type,function,useCapture)
5.2 jQuery事件模型
1 绑定事件
2 注销事件
3 jQuery事件模型中的Event对象
4 jQuery事件触发
5 jQuery事件切换
- 使用toggle()切换
- 使用hover()切换
6 jQuery事件委派
live(),die()7 jQuery事件命名空间
$().unbind(“.a”) $().trigger(“click!”)8 jQuery多事件绑定
9 jQuery自定义事件
5.3 jQuery页面初始化
1 使用jQuery的ready()方法
$(document).ready(function(a){})//一个参数a—引用jQuery函数，并
JQuery(function($){})
$(function(){})
$(function(me){me(‘div’).text(‘jQ函数别名’)})//默认$,或jQuery
不能和原生的load同用
2 ready事件的触发时机
$(window).load()
3 初始化事件的多次调用
load，第一次被第二次覆盖了
如果多个文件，ready可以无限多次调用
4 使用JS自定义的addLoadEvent
轻松实现多次调用load事件
function addLoadEvent(func){
var oldOnload=window.onload
if(typeof window.onload!=’function’){
window.onload=func
}else{
window.onload=function(){
oldOnload();
func()
}
}
}
5.4 使用JS自定义jQ的事件方法
1 JS与jQ的执行效率比较
原生比库执行效率更高（选择器，和事件模型）
load更好，不用担心兼容，且两者可以混合使用
浏览器兼容性很大差异的鼠标事件，jQ
2 自定义ready()方法
DOMContentLoaded;IE,onreadystatechange–document.readyState===’complete’
注销，避免反复触发
针对IE，模拟DOMContentLoaded事件的方法：判断document是否可以滚动
3 自定义bind()方法
DOMextend(“bind”,function(type,data,fn){
var _this=_this
if(_this.addEventListener){
_this.addEventListener(type,function(event){
event.datas=data
fn(event)
},false)
}else{
_this.attachEvent(“on”+type,function(){
var event=window.event
})
}
return _this
})
4 自定义one()方法
bind基础上添加注销行为
2018.1.12 星期五 00：11 P242
